// 导入 Pinia 的 defineStore 函数，用于定义状态管理仓库
import { defineStore } from 'pinia';

/**
 * 定义一个名为 'image' 的状态管理仓库，用于管理背景图片相关状态和操作
 * @returns 返回一个包含状态和操作的仓库实例
 */
export const useImageStore = defineStore('image', {
  /**
   * 定义仓库的状态
   * @returns 返回一个包含背景图片信息的对象
   */
  state: () => ({
    // 从 localStorage 中获取背景图片信息，如果不存在则为 null
    backgroundImage: localStorage.getItem('backgroundImage') || null as string | null
  }),
  /**
   * 定义仓库的操作方法
   */
  actions: {
    /**
     * 设置背景图片信息，并将其存储到 localStorage 中
     * @param image - 要设置的背景图片信息，可以是字符串或 null
     */
    setBackgroundImage(image: string | null) {
      this.backgroundImage = image;
      localStorage.setItem('backgroundImage', image || '');
    },
    /**
     * 清除背景图片信息，调用 setBackgroundImage 方法并传入 null
     */
    clearBackgroundImage() {
      this.setBackgroundImage(null);
    }
  }
});